<template>
  <div class="shoupai">
     <div class="sdl">001</div>
     <div class="sdl">002</div>
     <div class="sdl">003</div>
     <div class="sdl">004</div>
     <div class="sdl">005</div>
     <div class="sdl">006</div>
     <div class="sdl">007</div>
     <div class="sdl">008</div>
     <div class="sdl">009</div>
     <div class="sdl">010</div>
     <div class="sdl">011</div>
     <div class="sdl">012</div>
     <div class="sdl">013</div>
     <div class="sdl">014</div>
     <div class="sdl">015</div>
     <div class="sdl">016</div>
     <div class="sdl">017</div>
     <div class="sdl">018</div>
     <div class="sdl">019</div>
     <div class="sdl">020</div>
     <div class="sdl">022</div>
     <div class="sdl">023</div>
     <div class="sdl">024</div>
  </div>
</template>

<script>
  export default{
    name:'shoupai',
    data(){
      return{

      }
    },
    methods:{

    }
  }
</script>

<style scoped>
  *{
    margin: 0;
    padding: 0;
  }
  .shoupai{
    padding: 20px;
  }
  .sdl{
    height: 80px;
    width: 80px;
    background-color: #00FFFF;
    border-radius: 5px;
    text-align: center;
    line-height: 80px;
    font-weight: bold;
    font-size: 18px;
    display: inline-block;
    margin: 8px;
    color: #f40;
  }


</style>
